<template>
  <div class="radio-box" @click="change">
    <div class="noCheck" v-show="value != label"></div>
    <div class="checked" v-show="value == label"></div>
  </div>
</template>
<script>
export default {
  data() {
    return {
      value: this.model,
    }
  },
  props: ["model","label"],
  watch:{
    model(){
      this.value = this.model
    }
  },
  methods: {
    change() {
      this.$emit('change', this.label)
    }
  }
}
</script>
<style lang="less" scoped>
.radio-box{
  display: inline-block;
}
.noCheck{
  background: url("")
    no-repeat;
  width: 18px;
  height: 18px;
}
.checked{
  background: url("")
    no-repeat;
  width: 18px;
  height: 18px;
}
</style>